<%--
  Created by IntelliJ IDEA.
  User: liye
  Date: 2022/3/2
  Time: 14:34
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html>
<head>
    <title>中软国际OA系统</title>
    <link href="/css/bootstrap.css" rel="stylesheet" type="text/css">
    <script src="/js/jquery.min.js" type="text/javascript"></script>
    <script src="/js/bootstrap.min.js" type="text/javascript"></script>
</head>
<body>
    <h1>中软国际OA系统</h1>
    <p>欢迎回来，<a href="/curUser" title="点击查看登录用户信息">${loginUser.username}</a> <a href="/logout">登出</a></p>
    <p>当前会话ID: ${sessionId}</p>
    <hr/>

    <h2>账户余额查询</h2>
    <form class="form-inline">
        <input class="form-control" name="no" placeholder="输入要查询的账号">
        <button id="btn-search" class="btn btn-primary" type="button">查询</button>
    </form>
    <div>
        <p>账号ID: <b class="show-acc"></b></p>
        <p>当前余额: <b class="show-money"></b></p>
    </div>
    <script type="text/javascript">
        //1.给查询按钮绑定一个点击事件
        $("#btn-search").click(
            function () {
                //2.从输入框中获取到账号
                var no = $("input[name=no]").val().trim();
                //3.判断是否输入了账号
                if (no=='') {
                    alert("请输入账号后查询！");
                }
                else {
                    //4.提交AJAX请求，查询
                    $.get(
                        "/account/searchBalance",
                        {"no": no},
                        function (data) {
                            // alert(data)
                            if (data=='') {
                                alert("未查找到该账号：" + no);
                                $(".show-acc").text(null);
                                $(".show-money").text(null);
                            }
                            else {
                                $(".show-acc").text(data.no);
                                $(".show-money").text(data.money);
                            }
                        }
                    );
                }
            }
        );
    </script>
</body>
</html>
